<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>时间戳过滤</title>
    <link rel="stylesheet" href="../css/filter_timer.css">
</head>
<body>
    <div id="app">
        <input type="text" name="getnum" id="getnum" placeholder="输入正确的时间戳，否则自动添加当前时间">
        <button @click="get_now_time">添加时间</button>
        <ul v-for="item in numarr" :key="item.index">
            <li>时间戳为:{{item}}-----转化后时间为:{{item | change_time}}</li>
        </ul>
    </div>

    <script src="../js/vue.js"></script>
    <script src="../js/moment.js"></script>
    <script>
        let app = new Vue({
            el:"#app",
            data:{
                numarr : ['1579657789851','1563516693000','1578539380000']
            },
            filters:{
                change_time(time){
                    let cur_time = moment(parseInt(time)).format('YYYY/MM/DD hh:mm:ss')
                    return cur_time
                }
            },
            methods:{
                get_now_time(e){
                    if(e.target.previousElementSibling.value){
                        let time = e.target.previousElementSibling.value;
                        e.target.previousElementSibling.value = null;
                        this.numarr.push(time);
                    }else{
                        // valueOf()获取当前时间的时间戳
                        let new_time = Date.now()
                        this.numarr.push(new_time);
                        console.log(moment("20200808062016","YYYYMMDDhhmmss").valueOf());
                    }
                }
            }
        })
    </script>
</body>
</html>